package com.example.recipesapp.ui.components

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Card
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.ModalBottomSheet
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import com.example.recipesapp.data.Recipe
import java.io.File
import coil.compose.AsyncImage         // 基础用法
import coil.compose.AsyncImagePainter  // 状态监听
import coil.compose.rememberAsyncImagePainter // 高级配置

@Composable
fun RecipeItem(recipe: Recipe, onClick: () -> Unit) {
    Card(
        onClick = onClick,
        modifier = Modifier.padding(8.dp)
    ) {
        Column {
            AsyncImage(
                model = File(recipe.photoPath),
                contentDescription = "效果图",
                modifier = Modifier
                    .height(150.dp)
                    .fillMaxWidth()
            )
            Text(recipe.name, style = MaterialTheme.typography.titleMedium)
        }
    }
}